<template>

	<view class="text-area">
		<zb-tab :activeStyle="{
			    fontWeight: 'bold',
			    transform: 'scale(1.1)'
			    }" :data="navTimeList" v-model="active" @click-tab="timeSelectd"></zb-tab>

		<view class="card" v-for="item,index in navTimeList" v-show="item.value==active" :key="item.value">
			<!-- 微信 -->
			<!-- 支付宝 -->
			<view v-show="item.value===1">
				<view class="payConfigurationWeChat">
					<view class="formPayment">
						支付形式
					</view>
					<uni-data-checkbox class="formPaymentCheckBox" v-model="wxMerchant"
						:localdata="wx"></uni-data-checkbox>


					<view v-show="wxMerchant == '2'">
						<uni-forms :rules="rulesWxForm" ref="wxForm" :modelValue="wxForm" label-position="top">




							<uni-forms-item label="微信appid" name="appid" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="wxForm.appid"
									placeholder="请输入微信appid" />

							</uni-forms-item>
							<uni-forms-item label="直连商户号" name="mchid" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="wxForm.mchid"
									placeholder="请输入直连商户号" />

							</uni-forms-item>
							<uni-forms-item label="APIV3密钥" name="appV3Key" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="wxForm.appV3Key"
									placeholder="请输入APIV3密钥" />

							</uni-forms-item>
							<uni-forms-item label="证书序列号" name="merchantSerialNumber" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="wxForm.merchantSerialNumber"
									placeholder="请输入证书序列号" />

							</uni-forms-item>
							<uni-forms-item label="私钥" name="privateKeyPath" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="wxForm.privateKeyPath"
									placeholder="请输入私钥" />

							</uni-forms-item>
							<view class="sumbit-btn flex" @click.stop="saveInfo('wxForm')">
								保存信息
							</view>


						</uni-forms>
					</view>
					<view v-if="wxMerchant == '1'">
						<uni-forms :rules="rulesWxServiceForm" ref="wxServiceForm" :modelValue="wxServiceForm"
							label-position="top">




							<uni-forms-item label="服务商应用ID" name="spAppid" required labelWidth="180px">
								<uni-easyinput type="password" v-model="wxServiceForm.spAppid"
									placeholder="请输入服务商应用ID" />

							</uni-forms-item>
							<uni-forms-item label="服务商户号" name="spMchid" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="wxServiceForm.spMchid"
									placeholder="请输入服务商户号" />

							</uni-forms-item>
							<uni-forms-item label="子商户号" name="subMchid" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="wxServiceForm.subMchid"
									placeholder="请输入子商户号" />

							</uni-forms-item>
							<uni-forms-item label="APIv3密钥" name="appV3Key" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="wxServiceForm.appV3Key"
									placeholder="请输入APIv3密钥" />

							</uni-forms-item>
							<uni-forms-item label="证书序列号" name="merchantSerialNumber" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="wxServiceForm.merchantSerialNumber"
									placeholder="请输入私钥" />

							</uni-forms-item>
							<view class="sumbit-btn flex" @click.stop="saveInfo('wxServiceForm')">
								保存信息
							</view>


						</uni-forms>
					</view>
				</view>
			</view>

			<view v-if="item.value===2">
				<view class="payConfigurationWeChat">
					<view class="formPayment">
						支付形式
					</view>
					<uni-data-checkbox class="formPaymentCheckBox" v-model="zfbMerchant"
						:localdata="zfb"></uni-data-checkbox>


					<view v-if="zfbMerchant == '2'">

						<uni-forms :rules="rulesZfbForm" ref="zfbForm" :modelValue="zfbForm" label-position="top">




							<uni-forms-item label="支付宝应用ID" name="alipayAppid" required labelWidth="180px">
								<uni-easyinput type="password" v-model="zfbForm.alipayAppid"
									placeholder="请输入支付宝应用ID" />

							</uni-forms-item>
							<uni-forms-item label="支付宝公钥" name="alipayPublicKey" required labelWidth="180px">
								<uni-easyinput type="password" v-model="zfbForm.alipayPublicKey"
									placeholder="请输入支付宝公钥" />

							</uni-forms-item>
							<uni-forms-item label="应用公钥" name="appPublicKey" required labelWidth="180px">
								<uni-easyinput type="password" v-model="zfbForm.appPublicKey" placeholder="请选择应用公钥" />

							</uni-forms-item>
							<uni-forms-item label="应用私钥" name="appPrivateKey" required labelWidth="180px">
								<uni-easyinput type="password" v-model="zfbForm.appPrivateKey" placeholder="请输入应用私钥" />

							</uni-forms-item>

							<view class="sumbit-btn flex" @click.stop="saveInfo('zfbForm')">
								保存信息
							</view>


						</uni-forms>
					</view>
					<view v-show="zfbMerchant == '1'">
						<uni-forms :rules="rulesZfbServiceForm" ref="zfbServiceForm" :modelValue="zfbServiceForm"
							label-position="top">


							<uni-forms-item label="支付宝应用ID" name="alipayAppid" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="zfbServiceForm.alipayAppid"
									placeholder="请输入支付宝应用ID" />

							</uni-forms-item>

							<uni-forms-item label="结算收款方" name="transIn" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="zfbServiceForm.transIn"
									placeholder="请输入结算收款方" />

							</uni-forms-item>
							<uni-forms-item label="应用公钥" name="appPublicKey" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="zfbServiceForm.appPublicKey"
									placeholder="请选择应用公钥" />

							</uni-forms-item>
							<uni-forms-item label="应用私钥" name="appPrivateKey" required labelWidth="180px">
								<uni-easyinput type="password" trim="all" v-model="zfbServiceForm.appPrivateKey"
									placeholder="请输入应用私钥" />

							</uni-forms-item>

							<view class="sumbit-btn flex" @click.stop="saveInfo('zfbServiceForm')">
								保存信息
							</view>


						</uni-forms>
					</view>
				</view>

			</view>
		</view>
	</view>

</template>

<script>
	import alipayConfiguration from '../alipayConfigurationWeChat/alipayConfigurationWeChat.vue'
	import alipayConfigurationWeChat from '../alipayConfigurationWeChat/alipayConfigurationWeChat.vue'
	export default {
		components: {
			alipayConfigurationWeChat,
			alipayConfiguration
		},
		data() {

			return {
				merchantId: uni.getStorageSync('merchantId'),
				title: 'paymentConfiguration',
				active: 1,
				navTimeList: [{
						name: '微信',
						value: 1,

					},
					{
						name: '支付宝',
						value: 2,
					},
				],
				title: 'paymentConfiguration',
				wx: [{
					text: 'V3商户支付',
					value: '2'
				}, {
					text: '特约商户支付',
					value: '1'
				}],
				zfb: [{
					text: '普通商户支付',
					value: '2'
				}, {
					text: '间连商户支付',
					value: '1'
				}],
				formArr: ['wxForm', 'wxServiceForm', 'zfbForm', 'zfbServiceForm'],
				//   V3商户支付
				wxForm: {
					appid: '', //appid
					mchid: '', //直连商户号

					appV3Key: '', //APIv3密钥
					merchantSerialNumber: '', //证书序列号
					privateKeyPath: '', // 私钥
				},

				//   特约子商户支付
				wxServiceForm: {
					spAppid: '', // 服务商应用ID
					spMchid: '', //服务商户号
					subMchid: '', //子商户号
					appV3Key: '', //APIv3密钥
					merchantSerialNumber: '', //证书序列号
					privateKeyPath: '', //私钥
				},
				//   普通商户支付
				zfbForm: {
					alipayAppid: '', //支付宝应用ID
					alipayPublicKey: '', //支付宝公钥
					appPublicKey: '', //应用公钥
					appPrivateKey: '', //应用私钥
				},
				//  间连商户支付
				zfbServiceForm: {
					alipayAppid: '', //支付宝应用ID
					// alipayPublicKey: '', //支付宝公钥
					appPublicKey: '', //应用公钥
					appPrivateKey: '', //应用私钥
					// 账户类型
					transInType: 'loginName',
					// 结算收款方。
					transIn: '',
				},
				wxPayId: '',
				wxSpPayId: '',
				zfbPayId: '',
				zfbSpPayId: '',

				payType: '1',
				wxMerchant: '2',
				zfbMerchant: '2',
				rulesWxForm: {
					appid: {
						rules: [{
							required: true,
							errorMessage: '微信appid不能为空'
						}]
					},
					mchid: {
						rules: [{
							required: true,
							errorMessage: '直连商户号不能为空'
						}]
					},
					appV3Key: {
						rules: [{
							required: true,
							errorMessage: 'APIv3密钥不能为空'
						}]
					},
					merchantSerialNumber: {
						rules: [{
							required: true,
							errorMessage: '证书序列号不能为空'
						}]
					},
					privateKeyPath: {
						rules: [{
							required: true,
							errorMessage: '私钥不能为空'
						}]
					}
				},
				rulesWxServiceForm: {
					spAppid: {
						rules: [{
							required: true,
							errorMessage: '服务商应用ID不能为空'
						}]
					},
					spMchid: {
						rules: [{
							required: true,
							errorMessage: '服务商户号不能为空'
						}]
					},
					subMchid: {
						rules: [{
							required: true,
							errorMessage: '子商户号不能为空'
						}]
					},
					appV3Key: {
						rules: [{
							required: true,
							errorMessage: 'APIv3密钥不能为空'
						}]
					},
					merchantSerialNumber: {
						rules: [{
							required: true,
							errorMessage: '证书序列号不能为空'
						}]
					},
					privateKeyPath: {
						rules: [{
							required: true,
							errorMessage: '私钥不能为空'
						}]
					}
				},
				rulesZfbServiceForm: {

					alipayAppid: {
						rules: [{
							required: true,
							errorMessage: '支付宝应用ID为空'
						}]
					},

					appPrivateKey: {
						rules: [{
							required: true,
							errorMessage: '应用私钥不能为空'
						}]
					},
					appPublicKey: {
						rules: [{
							required: true,
							errorMessage: '应用公钥不能为空'
						}]
					},
					// transInType: {
					// 	rules: [{
					// 		required: true,
					// 		errorMessage: '私钥不能为空'
					// 	}]
					// },
					transIn: {
						rules: [{
							required: true,
							errorMessage: '结算收款不能为空'
						}]
					},



				},
				rulesZfbForm: {
					alipayAppid: {
						rules: [{
							required: true,
							errorMessage: '请输入支付宝应用ID'
						}]
					},
					alipayPublicKey: {
						rules: [{
							required: true,
							errorMessage: '请输入支付宝公钥'
						}]
					},
					appPrivateKey: {
						rules: [{
							required: true,
							errorMessage: '请输入应用私钥'
						}]
					},
					appPublicKey: {
						rules: [{
							required: true,
							errorMessage: '请输入应用公钥'
						}]
					},

				}
			}
		},
		mounted() {
			this.$nextTick(() => {
				this.active = 1

			})
			this.searchForm()
		},
		methods: {
			timeSelectd(e) {
				console.log(e.value)
				this.payType = String(e.value)
			},
			saveInfo(formName) {
				console.log(formName)
				console.log(this.$refs[formName])
				this.$refs[formName][0].validate((err, formData) => {
					// 如果校验成功 ，err 返回 null
					console.log(err, formData+'=======================')
					if (err) {
						console.log(err, formData+'=======================')
						return
					}else{
						this.$at.uniDoFunc({
							key: 'release',
							success: async () => {
								this.$at.lockKey('release');
								for (let i = 0; i < 4; i++) {
									if (!(formName == this.formArr[i])) {
										this.resetForm(this.formArr[i]);
									}
								}
						
								// 保存的时候存最后保存的sign 和 payType
								console.log((this.payType == '1' && this.wxMerchant == '1'))
								const sumbitForm = this.currentFormFn(this.payType)
								localStorage.setItem('payType', JSON.stringify({
									sign: sumbitForm[0][sumbitForm[1]].sign,
									payType: sumbitForm[0][sumbitForm[1]].type
								}));
								console.log(sumbitForm[0])
						
								const result = await this.$http.post({
									url: this.$api.insertSelective,
									data: {
										...sumbitForm[0]
									},
						
						
								});
								if (result.code == 2000) {
									this.searchForm()
									setTimeout(() => {
										this.$sun.toast(result.msg)
									}, 500)
						
									this.$at.releaseKey('release');
								} else {
									this.searchForm()
									setTimeout(() => {
										this.$sun.toast(result.msg)
									}, 500)
									this.$at.releaseKey('release');
								}
						
						
							}
						});
					}
				
				}).then(async res => {
					
					console.log('123123123',res)
				// if(res){
				
				// }
				

				})

			},
			findMatchingProperties(obj1, obj2) {
				console.log(obj1, obj2)
				for (const prop in obj2) {
					if (obj1.hasOwnProperty(prop)) {
						obj2[prop] = obj1[prop];
					}
				}
				console.log(obj2)
			},
			resetForm(formName) {
				// console.log(formName)
				// console.log(this.$refs[formName])
				// this.$refs[formName].resetFields();
			},


			async searchForm() {


				const res = await this.$http.post({
					url: this.$api.selectByPrimaryMerchantId,
					data: {
						merchantId: this.merchantId,
					},


				});

				console.log(res)
				// 获取到微信支付的id
				this.wxPayId = res.data.wxInfo?.id
				this.wxSpPayId = res.data.wxSpInfo?.id
				this.zfbPayId = res.data.zfbInfo?.id
				this.zfbSpPayId = res.data.zfbSpInfo?.id
				if (res.data.wxInfo?.type == '1' && res.data.wxInfo?.sign == '2') {
					this.findMatchingProperties(res.data.wxInfo, this.wxForm)
				}
				if (res.data.wxSpInfo?.type == '1' && res.data.wxSpInfo?.sign == '1') {
					this.findMatchingProperties(res.data.wxSpInfo, this.wxServiceForm)
				}
				if (res.data.zfbInfo?.type == '2' && res.data.zfbInfo?.sign == '2') {
					this.findMatchingProperties(res.data.zfbInfo, this.zfbForm)
				}
				if (res.data.zfbSpInfo?.type == '2' && res.data.zfbSpInfo?.sign == '1') {
					this.findMatchingProperties(res.data.zfbSpInfo, this.zfbServiceForm)
				}
				if (JSON.parse(localStorage.getItem('payType'))) {
					const sign = JSON.parse(localStorage.getItem('payType')).sign;
					const payType = JSON.parse(localStorage.getItem('payType')).payType;
					// this.active = payType
					if (payType == '1') {
						this.wxMerchant = sign
					} else {
						this.zfbMerchant = sign
					}
				}
				this.$nextTick(() => {
					// this.showEyeValueFn()
				})
			},

			// 当前的提交的form表单
			currentFormFn(payType) {
				console.log(payType)
				console.log(this.wxMerchant == '2')
				if (payType == '1' && this.wxMerchant == '2') {

					return [{
						wxInfo: {
							...this.wxForm,
							id: this.wxPayId ? this.wxPayId : '',
							merchantId: this.merchantId,
							type: (this.payType == '1' && this.wxMerchant == '2') ? this.payType : '',
							sign: (this.payType == '1' && this.wxMerchant == '2') ? this.wxMerchant : ''
						},
					}, 'wxInfo']
				} else if (payType == '1' && this.wxMerchant == '1') {
					return [{
							wxSpInfo: {
								...this.wxServiceForm,
								id: this.wxSpPayId ? this.wxSpPayId : '',
								merchantId: this.merchantId,
								type: (this.payType == '1' && this.wxMerchant == '1') ? this.payType : '',
								sign: (this.payType == '1' && this.wxMerchant == '1') ? this.wxMerchant : ''
							},
						},
						'wxSpInfo'
					]
				} else if (payType == '2' && this.zfbMerchant == '2') {
					return [{
						zfbInfo: {
							...this.zfbForm,
							id: this.zfbPayId ? this.zfbPayId : '',
							merchantId: this.merchantId,
							type: (this.payType == '2' && this.zfbMerchant == '2') ? this.payType : '',
							sign: (this.payType == '2' && this.zfbMerchant == '2') ? this.zfbMerchant : ''
						},
					}, 'zfbInfo']
				} else {
					return [{
						zfbSpInfo: {
							...this.zfbServiceForm,
							id: this.zfbSpPayId ? this.zfbSpPayId : '',
							merchantId: this.merchantId,
							type: (this.payType == '2' && this.zfbMerchant == '1') ? this.payType : '',
							sign: (this.payType == '2' && this.zfbMerchant == '1') ? this.zfbMerchant : ''
						},
					}, 'zfbSpInfo']
				}
			},
		}
	}
</script>

<style lang="less">
	.text-area {
		.card {
			.payConfigurationWeChat {
				padding: 30rpx;

			}

			.formPayment {
				font-size: 24rpx;
				margin-bottom: 20rpx;
			}

			.formPaymentCheckBox {
				margin-bottom: 20rpx;
			}
		}

		.sumbit-btn {
			width: 670rpx;


			bottom: 50rpx;

			height: 100rpx;
			color: #fff;
			border-radius: 10px;
			background-color: #1890FF;
		}

	}
</style>